<template>
  <view class="container">
    <!-- <toast></toast> -->
    <!-- <u-navbar title="财务中心" :bgColor="navbarClass.titleBgColor" @leftClick="backHome" :placeholder="true"> </u-navbar> -->
    <view class="hdBg">
      <xsj-image mode="aspectFit" width="100%" height="486rpx" src="../../static/image/entrance1.png">
        <template v-slot:loading>
          <u-loading-icon mode="circle"></u-loading-icon>
        </template>
      </xsj-image>
      <view class="imagePost" @click="gotoJump('/pageContent/introduction/introductionDetails')">
        <xsj-image mode="aspectFit" width="270rpx" height="78rpx" src="../../static/image/icon4.png">
          <template v-slot:loading>
            <u-loading-icon mode="circle"></u-loading-icon>
          </template>
        </xsj-image>
      </view>
    </view>

    <view class="gotoMore">
      <xsj-image mode="aspectFit" width="114rpx" height="114rpx" src="../../static/image/entrance3.png">
        <template v-slot:loading>
          <u-loading-icon mode="circle"></u-loading-icon>
        </template>
      </xsj-image>
      <view class="text1 u-line-2">艾溪湖管理处于2001年12月因南昌市区划调整成 立，隶属南昌市高新区管委会..</view>
      <text class="text2" @click="gotoJump('/pageContent/introduction/introductionDetails')">查看更多</text>
    </view>

    <view class="gotoMore">
      <xsj-image mode="aspectFit" width="220rpx" height="94rpx" src="../../static/image/entrance2.png">
        <template v-slot:loading>
          <u-loading-icon mode="circle"></u-loading-icon>
        </template>
      </xsj-image>
      <view class="text1 u-line-2">艾溪湖管理处于2001年12月因南昌市区划调整成 立，隶属南昌市高新区管委会..</view>
      <text class="text2" @click="gotoJump('/pageContent/introduction/styleDetails')">查看更多</text>
    </view>
  </view>
</template>

<script>
export default {
  data() {
    return {}
  },
  onLoad() {},
  methods: {
    gotoJump(url) {
      uni.navigateTo({
        url: url,
      })
    },
  },
}
</script>

<style lang="scss" scoped>
.container {
  background: #f6f6f6;

  .hdBg {
    width: 100%;
    position: relative;
    .imagePost {
      position: absolute;
      bottom: -32rpx;
      right: 0;
    }
  }
  .gotoMore {
    margin: 24rpx 24rpx 0 24rpx;
    padding: 24rpx 48rpx 0;
    display: flex;
    width: 702rpx;
    height: 352rpx;
    background: #ffffff;
    border-radius: 16rpx;
    flex-direction: column;
    align-items: center;
    .text1 {
      margin-top: 24rpx;
      margin-bottom: 32rpx;
      color: #333333;
      height: 78rpx;
    }
    .text2 {
      text-align: center;
      color: #333333;
      width: 100%;
      padding: 10rpx 0;
    }
  }
}
</style>
